import React from 'react'
import './style.css'
import { useDispatch, useSelector } from 'react-redux'
const Index = () => {
  const list = useSelector(state => state.list)
  const dispatch = useDispatch()
  const handleDelete = id => {
    dispatch({ type: 'del', payload: id })
  }
  return (
    <div>

      <ul>
        <li>
          <span>标题</span>
          <span>时间</span>
          <span>操作</span>
        </li>

        {
          list.map(v => {
            return  <li key={v.id}>
            <span>{v.title}</span>
            <span>{v.time}</span>
            <span>
              <button onClick={() => handleDelete(v.id)}>删除</button>
            </span>
          </li>
          })
        }
      </ul>
    </div>
  )
}

export default Index